<!DOCTYPE html>
<html lang="en">
<!--京东商城后台管理系统-->
<head>
    <meta charset="UTF-8">
    <title>添加商品</title>
    <link rel="stylesheet" href="js/bootstrap.min.css">
    <!--<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>-->
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/vue.min.js"></script>
    <script src="js/jquery.validate.js"></script>
    <script src="js/jquery.validate.regex.js"></script>
    <script>
        $(function () {
            $("#addForm").validate({
                rules: {
                    brand_id: {
                        required: true,
                        regex: /^[1-9]\d*$/
                    },
                    sort_id: {
                        required: true,
                        regex: /^[1-9]\d*$/
                    },
                    pro_name:{
                        required:true,
                        regex:/^[a-zA-Z\d\u4e00-\u9fa5]{1,12}$/
                    },
                    pro_price:{
                        required:true,
                        regex:/^[1-9]\d*$/
                    },
                    pro_stock:{
                        required:true,
                        regex:/^[1-9]\d*$/
                    },
                    pro_out:{
                        required:true,
                        regex:/^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$/
                    },
                    pro_state:{
                        required:true,
                        regex:/^[\u4e00-\u9fa5]{2}$/
                    },
                    pro_detail:{
                        required:false,
                        regex:/^.{0,200}$/
                    }
                },
                messages: {
                    brand_id: {
                        required: "请输入品牌编号",
                        regex: "品牌编号为正整数"
                    },
                    sort_id: {
                        required: "请输入种类编号",
                        regex: "种类编号为正整数"
                    },
                    pro_name:{
                        required:"请输入商品名称",
                        regex:"商品名为不带符号的字符"
                    },
                    pro_price:{
                        required:"请输入价格",
                        regex:"价格为正整数"
                    },
                    pro_stock:{
                        required:"请输入商品库存",
                        regex:"库存为正整数"
                    },
                    pro_out:{
                        required:"请输入商品过期时间",
                        regex:"时间格式为（年-月-日）"
                    },
                    pro_state:{
                        required:"请输入商品状态",
                        regex:"上架或者下架"
                    },
                    pro_detail:{
                        required:"",
                        regex:"请输入200字以内的描述"
                    }
                }
            });

            $("#postForm").click(function (){
                if ($('#addForm').valid()==true){
                    $.ajax({
                        url:"http://localhost:8080/addProduct",
                        type:"post",
                        data:{
                            "brandId":$("input[name='brand_id']").val(),
                            "sortId":$("input[name='sort_id']").val(),
                            "proName":$("input[name='pro_name']").val(),
                            "proPrice":$("input[name='pro_price']").val(),
                            "proStock":$("input[name='pro_stock']").val(),
                            "proOut": $("input[name='pro_out']").val(),
                            "proState":$("input[name='pro_state']").val(),
                            "proDetail":$("input[name='pro_detail']").val()
                        },
                        dataType:"json",
                        success:function (data){
                            alert("插入商品成功");
                            if(data){
                                location.href="http://localhost:8080/product_select.html";
                            }
                        }
                    })
                }
            });

        })

    </script>
</head>
<body >
<div class="row">
    <div class="col-md-2">
        <img src="images/logo-201305-b.png">
    </div>
    <div class="col-md-10">
        <h2 class="text-primary text-center">京东商城后台管理系统</h2>
    </div>
</div>

<div class="row"  style="background-color:#F5F5F5;">
    <!--侧边菜单-->
    <div class="col-md-2 text-center"  >
        <a href="#" class="list-group-item active">商品种类管理</a>
        <a href="sort1.html" class="list-group-item">添加商品种类</a>
        <a href="sort2.html" class="list-group-item">管理商品种类</a>
        <a href="sort3.html" class="list-group-item">商品品牌管理</a>
        <a href="sort4.html" class="list-group-item">商品品牌添加</a>
        <a href="#" class="list-group-item active">商品管理</a>
        <a href="product_add.html" class="list-group-item color">商品添加</a>
        <a href="product_delete.html" class="list-group-item">商品删除</a>
        <a href="product_change.html" class="list-group-item">商品修改</a>
        <a href="product_select.html" class="list-group-item">商品查询</a>
        <a href="product_addImg.html" class="list-group-item">商品图片添加</a>
        <a href="#" class="list-group-item active">订单管理</a>
        <a href="orders_select.html" class="list-group-item">查看订单</a>
        <a href="orders_change.html" class="list-group-item">修改订单</a>
        <a href="#" class="list-group-item active">用户管理</a>
    </div>
    <div class="col-md-10">
        <!--面包屑导航-->
        <ol class="breadcrumb">
            <li><a href="#">首页</a></li>
            <li><a href="#">商品管理</a></li>
            <li><a href="#">添加商品</a></li>
            <!--<li class="active">十一月</li>-->
        </ol>
        <div style="padding: 10px 100px 10px;">
            <form class="bs-example bs-example-form" id="addForm" role="form">
                <div class="input-group">
                    <span class="input-group-addon">商品名称</span>
                    <input type="text" class="form-control" name="pro_name" placeholder="请输入商品名称">
                </div><br>
                <div class="warn"></div>
                <div class="input-group">
                    <span class="input-group-addon">商品种类编号</span>
                    <input type="text" class="form-control" name="sort_id" placeholder="请输入商品种类编号">
                </div><br>
                <div class="input-group">
                    <span class="input-group-addon">商品品牌编号</span>
                    <input type="text" class="form-control" name="brand_id" placeholder="请输入商品品牌编号">
                </div><br>
                <div class="input-group">
                    <span class="input-group-addon">商品价格</span>
                    <input type="text" class="form-control" name="pro_price" placeholder="请输入商品价格">
                </div><br>
                <div class="input-group">
                    <span class="input-group-addon">商品库存</span>
                    <input type="text" class="form-control" name="pro_stock" placeholder="请输入商品库存">
                </div><br>
                <div class="input-group">
                    <span class="input-group-addon">商品状态</span>
                    <input type="text" class="form-control" name="pro_state" placeholder="请输入商品状态">
                </div><br>
                <div class="input-group">
                    <span class="input-group-addon">商品过期时间</span>
                    <input type="date" class="form-control" name="pro_out" placeholder="请输入商品过期时间">
                </div><br>
                <div class="input-group">
                    <span class="input-group-addon">商品种类描述</span>
                    <input type="text" class="form-control" name="pro_detail" placeholder="请输入商品种类描述">
                </div><br>
            </form>
            <button type="button" class="btn btn-success" id="postForm">添加</button>
        </div>

    </div>




</div>




</body>
</html>